import axios from "axios" // 引入axios
import { ElMessage, ElMessageBox } from "element-plus"
import { useUserStore } from "@/stores/use_user_store"
import router from "@/router/index"
import { ElLoading } from "element-plus"
import * as util from "@/utils"

const service = axios.create({
    baseURL: import.meta.env.VITE_BASE_API,
    timeout: 99999,
})
let activeAxios = 0
let timer
let loadingInstance
const showLoading = (
    option = {
        target: null,
    }
) => {
    // console.log(`showLoading ing👇`)
    const loadDom = document.getElementById("页面容器")
    // console.log(`loadDom 👉`,loadDom)
    activeAxios++
    if (timer) {
        clearTimeout(timer)
    }
    timer = setTimeout(() => {
        if (activeAxios > 0) {
            console.log(`option.target 👉`, option.target)
            if (!option.target) {
                console.log(`loadDom 👉`, loadDom)
                option.target = loadDom
            }
            loadingInstance = ElLoading.service(option)
        }
    }, 400)
}

const closeLoading = () => {
    activeAxios--
    if (activeAxios <= 0) {
        clearTimeout(timer)
        loadingInstance && loadingInstance.close()
    }
}
// http request 拦截器
service.interceptors.request.use(
    config => {
        if (!config.donNotShowLoading) {
            showLoading(config.loadingOption)
        }
        const userStore = useUserStore()
        config.headers = {
            "Content-Type": "application/json",
            "x-token": userStore.token,
            "x-user-id": userStore.userInfo.ID,
            ...config.headers,
        }
        return config
    },
    error => {
        if (!error.config.donNotShowLoading) {
            closeLoading()
        }
        ElMessage({
            showClose: true,
            message: error,
            type: "error",
        })
        return error
    }
)

// http response 拦截器
service.interceptors.response.use(
    response => {
        const userStore = useUserStore()
        if (!response.config.donNotShowLoading) {
            closeLoading()
        }
        if (response.headers["new-token"]) {
            userStore.setToken(response.headers["new-token"])
        }
        if (response.data.code === 0 || response.headers.success === "true") {
            if (response.headers.msg) {
                response.data.msg = decodeURI(response.headers.msg)
            }
            return response.data
        } else {
            console.log(`service.interceptors 出错 response  👉`, response)
            // ElMessage({
            //   showClose: true,
            //   message: response.data.msg || decodeURI(response.headers.msg),
            //   type: 'error'
            // })
            util.提示(util.提示enum.出错, response.data.msg || decodeURI(response.headers.msg))
            return response.data.msg ? response.data : response
        }
    },
    error => {
        if (!error.config.donNotShowLoading) {
            closeLoading()
        }

        if (!error.response) {
            ElMessageBox.confirm(
                `
        <p>检测到请求错误</p>
        <p>${error}</p>
        `,
                "请求报错",
                {
                    dangerouslyUseHTMLString: true,
                    distinguishCancelAndClose: true,
                    confirmButtonText: "稍后重试",
                    cancelButtonText: "取消",
                }
            )
            return
        }

        switch (error.response.status) {
            case 500:
                ElMessageBox.confirm(
                    `
        <p>检测到接口错误${error}</p>
        <p>错误码<span style="color:red"> 500 </span>：此类错误内容常见于后台panic，请先查看后台日志，如果影响您正常使用可强制登出清理缓存</p>
        `,
                    "接口报错",
                    {
                        dangerouslyUseHTMLString: true,
                        distinguishCancelAndClose: true,
                        confirmButtonText: "清理缓存",
                        cancelButtonText: "取消",
                    }
                ).then(() => {
                    const userStore = useUserStore()
                    userStore.ClearStorage()
                    router.push({ name: "Login", replace: true })
                })
                break
            case 404:
                console.log(`404 error 👉`, error)
                // ElMessageBox.confirm(`
                //   <p>检测到接口错误${error}</p>
                //   <p>错误码<span style="color:red"> 404 </span>：此类错误多为接口未注册（或未重启）或者请求路径（方法）与api路径（方法）不符--如果为自动化代码请检查是否存在空格</p>
                //   `, '接口报错', {
                //   dangerouslyUseHTMLString: true,
                //   distinguishCancelAndClose: true,
                //   confirmButtonText: '我知道了',
                //   cancelButtonText: '取消'
                // })
                break
            case 401:
                ElMessageBox.confirm(
                    `
          <p>无效的令牌</p>
          <p>错误码:<span style="color:red"> 401 </span>错误信息:${error}</p>
          `,
                    "身份信息",
                    {
                        dangerouslyUseHTMLString: true,
                        distinguishCancelAndClose: true,
                        confirmButtonText: "重新登录",
                        cancelButtonText: "取消",
                    }
                ).then(() => {
                    const userStore = useUserStore()
                    userStore.ClearStorage()
                    router.push({ name: "Login", replace: true })
                })
                break
        }

        return error
    }
)
export default service
